page{
	background: #F5F6FA;
}

.top{
	position: fixed;
	padding-top: 120rpx;
	font-weight: 600;
	font-size: 38rpx;
	color: #333333;
	line-height: 49rpx;
	 left: 30rpx
}


.class_h{
	display: flex;
	flex-direction: column;
	background-size: 100% 100%;
/* 	padding-bottom: 220rpx; */
	height: 90vh;
	position: relative;
}

.total{
	display: flex;
	flex-direction: column;
	margin-top: 20rpx;
	padding-left: 32rpx;
	padding-right: 32rpx;
	/* background-color: #dadee4; */
	/* border-radius: 16rpx; */
}

.effect_title{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	text-align: center;
	padding-top: 32rpx;
	padding-left: 32rpx;
	padding-right: 32rpx;
}

.effect_t{
	font-weight: bold;
	font-size: 32rpx;
	color: rgba(0,0,0,0.9);
	/* line-height: 48rpx; */
}
.blood_top{
	display: flex;
	
	margin: 220rpx 32rpx 15rpx 32rpx;
}
.blood_sugar{
	width: 480rpx;
	height: 160rpx;
}

.blood_pressure{
	width: 196rpx;
	height: 160rpx;
}


.containers {
	display: flex;
	padding-top: 20rpx;
	padding-left: 32rpx;
	padding-right: 32rpx;
	justify-content: center;
	align-items: center;
     width: 320px;
	 flex-direction: column;
  /* 背景长胶囊 */
}

.capsule-bg {
  width: 100%;
  height: 36px;
  background-color: #ecf0f6;
  border-radius: 18px;
  display: flex;
  justify-content: space-between;
  padding: 3px;
  box-sizing: border-box;
}

.capsule {
  flex: 1;
  margin: 0 3px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 15px;
  background-color: transparent;
  color: #333;
}

.capsule.active {
  background-color: #ffffff;
}

.time-range {
  margin-top: 10px;
  text-align: center;
  color: #333;
  background-color: #ecf0f6;
  padding: 15rpx;
  border-radius: 10rpx;
  }
  
  .report_text{
	  display: flex;
	  padding-top: 20rpx;
	  padding-left: 32rpx;
	  padding-right: 32rpx;
	  padding-bottom: 32rpx;
	  color: rgba(102, 102, 102, 1);
	  font-size: 14px;
	  line-height: 22px;
  }
  
  .bubble-container {
    display: flex;
	flex-direction: row;
    justify-content: center;
    margin-top: 57rpx; /* 控制气泡位置 */
	margin-left: 38rpx;
  }
  
.ruler-box { position: relative; width: 100%; height: 210rpx; overflow: hidden; }
.indicator { position: absolute; top: 0; bottom: 0; left: 51.5%; width: 2px; background: red; z-index: 20; }
.fade-left, .fade-right { position: absolute; top: 0; bottom: 0; width: 60px; z-index: 30; pointer-events: none; }
.fade-left { left: 0; }
.fade-right { right: 0;}

.bubble {  
  display: flex;
  color: rgba(40, 126, 228, 1);
  font-size: 35px;
  font-weight: bold;
}
.low{
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	/* background-color: #f1c98c; */
	padding: 5rpx;
	height: 30rpx;
	width: 50rpx;
	font-size: 22rpx;
	color: #fff;
	margin-top: 36rpx;
}
.unit{
	display: flex;
	margin-left: 10rpx;
	align-items: flex-end;
	margin-bottom: 11rpx;
}

/* 箭头在下面居中 */
.bubble-arrow {
  position: absolute;
  bottom: -16rpx; /* 往下移出气泡 */
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 16rpx solid transparent;
  border-right: 16rpx solid transparent;
  border-top: 16rpx solid #3551A2; /* 颜色要和气泡背景一致 */
}

.containert {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding-left: 20rpx;
   padding-right: 20rpx;
   padding-top: -20rpx;
  padding-bottom: 100rpx;
}

.box {
  border: 1px solid #ccc;
  border-radius: 16rpx;
  width: 45%;
  box-sizing: border-box;
  padding: 20rpx;
}

.item {
  text-align: center;
  padding: 16rpx 0;
  font-size: 28rpx;
  border-bottom: 1px solid #eee;
  color: #333;
}

/* 去掉最后一项分割线 */
.item:last-child {
  border-bottom: none;
}

/* 选中状态样式 */
.active {
  background-color: #007aff;
  color: #fff !important;
  border-radius: 8rpx;
}
.submit_icon{
	display: flex;
	position: fixed;
	bottom: 180rpx;
	left: 50%;
	transform: translateX(-50%); /* 自身居中 */
}

.right,
.left{
	display: flex;
	flex-direction: column;
	width: 160px;
	height: 208px;
	background-color: #ECF0F6;
	border-radius: 10rpx;
}

.popup-box {
  width: 550rpx;
  background: #fff;
  border-radius: 20rpx;
  padding: 40rpx 30rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.popup-icon {
  width: 100rpx;
  height: 100rpx;
  margin-bottom: 20rpx;
}
.popup-title {
  font-size: 32rpx;
  font-weight: bold;
  color: #333;
  margin-bottom: 10rpx;
}
.popup-desc {
  font-size: 26rpx;
  color: #666;
  text-align: center;
  margin-bottom: 30rpx;
}
.btn-group {
  display: flex;
  flex-direction: column;
  gap: 20rpx;
  width: 100%;
}


.box-container {
  
  height: 382rpx; 
  overflow: hidden;
}

.box {
 /* height: 462rpx; */
  width: 160px;
  overflow: hidden;
}

scroll-view {
  height: 100%;
}

.item {
  text-align: center;
  padding: 20rpx 0;
  border-bottom: 1rpx solid #f1f1f1;
  font-size: 28rpx;
  color: #666;
  width: 136px;
}


.box-containers {
  
  height: 262rpx; /* 整体高度 */
  overflow: hidden;
}

.boxs {
  height: 262rpx;
  width: 230rpx;
  overflow: hidden;
}
